﻿@page "/checkboxlist"

<RadzenText TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8">
    CheckBoxList
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" class="rz-pb-4">
    Demonstration and configuration of the Radzen Blazor <strong>CheckBoxList</strong> component.
</RadzenText>

<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Get and Set the value of CheckBoxList
</RadzenText>
<RadzenText TextStyle="TextStyle.Body1" class="rz-mb-8">
    As all Radzen Blazor input components the <strong>CheckBoxList</strong> has a Value property which gets and sets the value of the component. Use <code>@@bind-Value</code> to get the user input.
</RadzenText>
<RadzenExample ComponentName="CheckBoxList" Example="CheckBoxListBindValue">
    <CheckBoxListBindValue />
</RadzenExample>

<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Get and Set the value of CheckBoxList using Value and Change event
</RadzenText>
<RadzenText TextStyle="TextStyle.Body1" class="rz-mb-8">
    Value property can be used to set the value of the component and <code>Change</code> event to get the user input.
</RadzenText>
<RadzenExample ComponentName="CheckBoxList" Example="CheckBoxListChangeEvent">
    <CheckBoxListChangeEvent />
</RadzenExample>

<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Set CheckBoxList orientation
</RadzenText>
<RadzenExample ComponentName="CheckBoxList" Example="CheckBoxListOrientation">
    <CheckBoxListOrientation />
</RadzenExample>

<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Populate CheckBoxList items from data
</RadzenText>
<RadzenExample ComponentName="CheckBoxList" Example="CheckBoxListItemsFromData">
    <CheckBoxListItemsFromData />
</RadzenExample>

<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Statically declared and populated CheckBoxList items from data
</RadzenText>
<RadzenExample ComponentName="CheckBoxList" Example="CheckBoxListDeclaredAndItemsFromData">
    <CheckBoxListDeclaredAndItemsFromData />
</RadzenExample>

<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Select all CheckBoxList items
</RadzenText>
<RadzenExample ComponentName="CheckBoxList" Example="CheckBoxListSelectAll">
    <CheckBoxListSelectAll />
</RadzenExample>

<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Disabled CheckBoxList item
</RadzenText>
<RadzenExample ComponentName="CheckBoxList" Example="CheckBoxListDisabledItem">
    <CheckBoxListDisabledItem />
</RadzenExample>

<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    ReadOnly CheckBoxList item
</RadzenText>
<RadzenExample ComponentName="CheckBoxList" Example="CheckBoxListReadOnlyItem">
    <CheckBoxListReadOnlyItem />
</RadzenExample>